

import 'package:flutter/material.dart';
import 'package:video_player/video_player.dart';

class ListViewItemWidget extends StatefulWidget {
  const ListViewItemWidget({Key? key}) : super(key: key);

  @override
  State<ListViewItemWidget> createState() => _ListViewItemWidgetState();
}

class _ListViewItemWidgetState extends State<ListViewItemWidget> {

  // 创建视频播放控制器
  VideoPlayerController? _controller;
  bool _isPlay = false;
  @override
  void initState() {
    super.initState();
    _controller = VideoPlayerController.network(
        'https://flutter.github.io/assets-for-api-docs/assets/videos/bee.mp4')
      ..initialize().then((_) {
        setState(() {});
      });
  }


  @override
  Widget build(BuildContext context) {
    return Container(
      margin: EdgeInsets.only(top: 2),
      color: Colors.white,
      padding: EdgeInsets.all(8),
      child: Column(
        crossAxisAlignment: CrossAxisAlignment.start,
        children: [
          Row(
            children: [
              Icon(Icons.one_k),
              Text("早起的年轻人")
            ],
          ),
          SizedBox(height: 8,),
          Container(
            height: 220,
            child: Stack(
              children: [
                // 第一层的视频
                Positioned.fill(
                  child: GestureDetector(
                    onTap: (){
                      _controller!.pause();
                      _isPlay = false;
                      setState(() {
                        
                      });
                    },
                    child: AspectRatio(
                      aspectRatio: _controller!.value.aspectRatio,
                      child: VideoPlayer(_controller!),
                      ),
                  )
                  
                  ),

                // 第二层的控制按钮
                buildControllerWidget()

              ],
            ),
          )
        ],
      ),
    );
    
  }
  Widget buildControllerWidget(){
    if(_isPlay){
      // 如果正在播放
      return Container();

    }
    return Positioned.fill(
              child:Container(
                // 透明度
                color: Colors.blueGrey.withOpacity(0.5),
                child:GestureDetector(
                onTap: (){
                  _isPlay = true;
                  _controller!.play();
                  setState(() {
                    
                  });
                },
                child:  Icon(Icons.play_circle_fill),
                )
              ));
    }
}